@import './vw';

* {
  box-sizing: border-box;
}

body {
  height: 100vh;
  width: 100vw;
  background-image: url(../assets/images/bg1.jpg);
  background-size: 100%;

  .search-box {
    height: vw(100);
    background-color: rgba(0, 0, 0, 0.92);
    border-bottom: 1px solid #524e4d;
    display: flex;
    justify-content: space-around;
    align-items: center;
    position: relative;

    .red-c {
      height: vw(56);
      width: vw(56);
      background-color: red;
      border-radius: 50%;
      border: 1px solid #4e1412;
      position: relative;

      i {
        position: absolute;
        top: vw(4);
        left: vw(3);
        font-size: vw(45);
        color: #fff;
      }
    }

    img {
      position: absolute;
      top: vw(34);
      left: vw(170);
      height: vw(32);
    }

    input {
      margin-left: vw(20);
      padding-left: vw(70);
      height: vw(60);
      width: 72%;
      background-color: rgba(0, 0, 0, 0.9);
      border: vw(2) solid #fff;
      border-radius: vw(30);
      font-size: vw(28);
      outline: none;
    }

  }

  .my{
    height: vw(404);
    background-color: rgba(0, 0, 0, 0.92);
    display: flex;
    flex-direction: column;
    align-items: center;

    .pic{
      img{
        margin: vw(96) 0 vw(26);
        height: vw(145);
        border-radius: 50%;
      }
    }

    p{
      font-size: vw(28);
      line-height: vw(42);

      a{
        color: #faf9f7;
      }
      
      &:nth-of-type(2){
        // line-height: vw(40);
        border-bottom: 1px solid #484848;
        font-size: vw(20);
        color: #757575;
        // text-decoration: underline;
      }
    }

  }

  .line{
    height: vw(26);
    background-color: #303030;
  }

  .content{
    padding-top: vw(4);
    height: vw(600);
    background-color: rgba(0, 0, 0, 0.92);

    .text{
      margin: 0 auto;
      height: vw(103);
      width: 90%;
      border-bottom: 1px solid #363636;
      display: flex;
      justify-content: space-between;
      align-items: flex-end;
      color: #fff;
      font-size: vw(25);
      line-height: vw(85);

      &:last-of-type{
        border-bottom:none;
      }
    }
  }
}